<template>
	<uni-row class="demo-uni-row">
		<uni-col :span="6">
			<view class="demo-uni-col dark">
				<uni-tag text="确定" type=""></uni-tag>
			</view>
		</uni-col>
		<uni-col :span="12">
			<view class="demo-uni-col light"></view>
		</uni-col>
		<uni-col :span="6">
			<view class="demo-uni-col dark">
				<uni-tag text="确定" type=""></uni-tag>
			</view>
		</uni-col>
	</uni-row>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
.demo-uni-row {
	margin-bottom: 10px;
	/* QQ、抖音小程序文档写有 :host，但实测不生效 */
	/* 百度小程序没有 :host，需要设置block */
	/* #ifdef MP-TOUTIAO || MP-QQ || MP-BAIDU */
	display: block;
	/* #endif */
}

/* 支付宝小程序没有 demo-uni-row 层级 */
/* 微信小程序使用了虚拟化节点，没有 demo-uni-row 层级 */
/* #ifdef MP-ALIPAY || MP-WEIXIN */
/deep/ .uni-row {
	margin-bottom: 10px;
}
/* #endif */

.demo-uni-col {
	height: 36px;
	border-radius: 4px;
}

.dark_deep {
	background-color: #99a9bf;
}

.dark {
	background-color: #d3dce6;
}

.light {
	background-color: #e5e9f2;
}

</style>